<template>
  <div class="code-log-wrap">
    <!-- tab区 -->
    <div class="tabs-filter-container">
      <el-radio-group size="small" v-model="searchObj.areaPosition" @change="search">
        <el-radio-button label="province">场所扫码日志</el-radio-button>
        <el-radio-button label="city">设备扫码日志</el-radio-button>
      </el-radio-group>
    </div>
    <el-table
      size="medium"
      :data="tabItems"
      ref="table"
      style="width: 100%;"
      v-loading="tabLoading"
    >
      <el-table-column
        label="区域"
        :show-overflow-tooltip="true"
        align="left"
        min-width="80px"
        prop="name"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="累计申领机构数"
        align="left"
        prop="name"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination-box">
      <el-pagination
        :background="true"
        :current-page="pagination.currentPage"
        :page-size="pagination.pageSize"
        :page-count="pagination.pageCount"
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>

<script>
import {reqUrl1} from '@/http/apiUrls.js';
export default {
  name: 'CodeLog',
  data() {
    return {
      tabLoading: false,
      tableKey: 0,
      pageItems: 10, // 每页查询条数
      pagination: {
        currentPage: 1, // 当前页
        pageSize: 10, // 每页显示条数
        pageCount: 1, // 总页数
      },
      tabItems: [{
        name: 'test1'
      },{
        name: 'test2'
      }],
      searchObj: {
        areaPosition: 'province',
        name: '',
        orgName: '',
        timeRange: []
      },
    }
  },
  created(){
    // this.getData(1, this.pageItems, this.searchObj)
  },
  methods: {
    search(){
      console.log(this.searchObj);
      // this.getData(1, this.pageItems, this.searchObj)
    },
    reset(){
      this.searchObj = {
        name: '',
        orgName,
        timeRange: []
      }
      //  this.getData(1, this.pageItems, {})
    },
    getData(current , size, model){
      let requestData = {
        current,
        size,
        model
      }
      this.tabLoading = true;
      this.$postJson(reqUrl1, requestData).then(res => {
        this.tabLoading = false;
        if(res){
          const pagination = {
            currentPage: parseInt(res.current), // 当前页面号
            pageSize: parseInt(res.size), // 每页条目数
            pageCount: parseInt(res.pages), // 总页面数
          }
          this.pagination = pagination;
          this.tabItems = res.records;
        }
      })
    },
    async handleSizeChange(val) {
      this.pageItems = val
      await this.getData(1, this.pageItems, this.searchObj)
    },
    async handleCurrentChange(val) {
      await this.getData(val, this.pageItems, this.searchObj)
    },
    itemDetail(item){
      console.log(item);
      // this.$router.push({
      //   path: "/eve/bus-user/detail",
      //   query: {id: item.id}
      // })
    },
    exportExcel() {
      // if (this.queryParams.timeRange) {
      //   this.queryParams.extra.createTime_st = this.queryParams.timeRange[0];
      //   this.queryParams.extra.createTime_ed = this.queryParams.timeRange[1];
      // }
      // this.queryParams.extra.fileName = '导出登录日志数据';
      // loginLogApi.export(this.queryParams).then(response => {
      //   downloadFile(response);
      // });
    },
  }
}
</script>
<style lang="scss" scoped>
.tabs-filter-container{
  margin-bottom: 10px;
}

.code-log-wrap{
  padding: 1rem;
}
</style>